Node / ReticulumProjects / MeshChatX.git / files / meshchatx / src / frontend / style.css

Displaying Raw • Download

Tb4b4b4@Tff7b72import Ta5d6ff'tailwindcss'Tb4b4b4;

Tb4b4b4@Tff7b72plugin Ta5d6ff'@tailwindcss/forms'Tb4b4b4;

Tb4b4b4@Tff7b72custom-variant Tff7b72dark Tff7b72(Tff7b72&Tb4b4b4:Tf0883ewhereTff7b72(Tb4b4b4.T56d364darkTff7b72, Tb4b4b4.T56d364dark Tff7b72*Tff7b72)Tff7b72)Tb4b4b4;

Tb4b4b4@Tff7b72theme Tb4b4b4{

Tff7b72--color-sem-canvasTff7b72: Tff7b72varTff7b72(Tff7b72--mc-canvasTff7b72)Tff7b72;

Tff7b72--color-sem-surfaceTff7b72: Tff7b72varTff7b72(Tff7b72--mc-surfaceTff7b72)Tff7b72;

Tff7b72--color-sem-borderTff7b72: Tff7b72varTff7b72(Tff7b72--mc-borderTff7b72)Tff7b72;

Tff7b72--color-sem-border-cardTff7b72: Tff7b72varTff7b72(Tff7b72--mc-border-cardTff7b72)Tff7b72;

Tff7b72--color-sem-border-strongTff7b72: Tff7b72varTff7b72(Tff7b72--mc-border-strongTff7b72)Tff7b72;

Tff7b72--color-sem-fgTff7b72: Tff7b72varTff7b72(Tff7b72--mc-textTff7b72)Tff7b72;

Tff7b72--color-sem-fg-secondaryTff7b72: Tff7b72varTff7b72(Tff7b72--mc-text-secondaryTff7b72)Tff7b72;

Tff7b72--color-sem-fg-mutedTff7b72: Tff7b72varTff7b72(Tff7b72--mc-text-mutedTff7b72)Tff7b72;

Tff7b72--color-sem-fg-labelTff7b72: Tff7b72varTff7b72(Tff7b72--mc-text-labelTff7b72)Tff7b72;

Tff7b72--color-sem-accentTff7b72: Tff7b72varTff7b72(Tff7b72--mc-accentTff7b72)Tff7b72;

Tff7b72--color-sem-accent-hoverTff7b72: Tff7b72varTff7b72(Tff7b72--mc-accent-hoverTff7b72)Tff7b72;

Tff7b72--color-sem-action-primaryTff7b72: Tff7b72varTff7b72(Tff7b72--mc-action-primaryTff7b72)Tff7b72;

Tff7b72--color-sem-action-primary-hoverTff7b72: Tff7b72varTff7b72(Tff7b72--mc-action-primary-hoverTff7b72)Tff7b72;

Tff7b72--color-sem-focusTff7b72: Tff7b72varTff7b72(Tff7b72--mc-focusTff7b72)Tff7b72;

Tff7b72--color-sem-glassTff7b72: Tff7b72varTff7b72(Tff7b72--mc-glass-surfaceTff7b72)Tff7b72;

Tff7b72--color-sem-surface-mutedTff7b72: Tff7b72varTff7b72(Tff7b72--mc-surface-mutedTff7b72)Tff7b72;

Tff7b72--color-sem-surface-raisedTff7b72: Tff7b72varTff7b72(Tff7b72--mc-surface-raisedTff7b72)Tff7b72;

Tff7b72--color-sem-infoTff7b72: Tff7b72varTff7b72(Tff7b72--mc-infoTff7b72)Tff7b72;

Tff7b72--color-sem-successTff7b72: Tff7b72varTff7b72(Tff7b72--mc-successTff7b72)Tff7b72;

Tff7b72--color-sem-warningTff7b72: Tff7b72varTff7b72(Tff7b72--mc-warningTff7b72)Tff7b72;

Tff7b72--color-sem-dangerTff7b72: Tff7b72varTff7b72(Tff7b72--mc-errorTff7b72)Tff7b72;

Tff7b72--color-sem-focus-borderTff7b72: Tff7b72varTff7b72(Tff7b72--mc-focus-borderTff7b72)Tff7b72;

Tff7b72--color-sem-file-input-bgTff7b72: Tff7b72varTff7b72(Tff7b72--mc-file-input-bgTff7b72)Tff7b72;

Tff7b72--color-sem-file-input-textTff7b72: Tff7b72varTff7b72(Tff7b72--mc-file-input-textTff7b72)Tff7b72;

Tb4b4b4}

T8b949e/*

The default border color has changed to `currentcolor` in Tailwind CSS v4,

so we've added these compatibility styles to make sure everything still

looks the same as it did with Tailwind CSS v3.

If we ever want to remove these styles, we need to add an explicit border

color utility to any element that depends on these defaults.

*/

Tb4b4b4@Tff7b72layer Tff7b72base Tb4b4b4{

Tff7b72*Tff7b72,

Tb4b4b4::Tf0883eafterTff7b72,

Tb4b4b4::Tf0883ebeforeTff7b72,

Tb4b4b4::Tf0883ebackdropTff7b72,

Tb4b4b4::Tf0883efile-selector-button Tb4b4b4{

Tff7b72border-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--color-gray-T79c0ff200Tb4b4b4, Te6edf3currentcolorTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tb4b4b4}

Tff7b72* Tb4b4b4{

Tff7b72scrollbar-widthTb4b4b4: Tff7b72thinTb4b4b4;

Tff7b72scrollbar-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-scrollbar-thumbTb4b4b4) Td2a8ffvarTb4b4b4(Te6edf3--mc-scrollbar-trackTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tff7b72*Tb4b4b4::Tf0883e-webkit-scrollbar Tb4b4b4{

Tff7b72widthTb4b4b4: T79c0ff10Tffa657pxTb4b4b4;

Tff7b72heightTb4b4b4: T79c0ff10Tffa657pxTb4b4b4;

Tb4b4b4}

Tff7b72*Tb4b4b4::Tf0883e-webkit-scrollbar-track Tb4b4b4{

Tff7b72backgroundTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-scrollbar-trackTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tff7b72*Tb4b4b4::Tf0883e-webkit-scrollbar-thumb Tb4b4b4{

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-scrollbar-thumbTb4b4b4)Tb4b4b4;

Tff7b72border-radiusTb4b4b4: T79c0ff999Tffa657pxTb4b4b4;

Tff7b72borderTb4b4b4: T79c0ff2Tffa657px Tff7b72solid Td2a8ffvarTb4b4b4(Te6edf3--mc-scrollbar-thumb-borderTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364glass-card Tb4b4b4{

@apply bg-sem-glass backdrop-blur-sm border border-sem-border-card rounded-3xl shadow-xl px-4 py-4Tb4b4b4;

Tb4b4b4}

Tff7b72htmlTff7b72[Tff7b72data-ui-glassTff7b72=Ta5d6ff"0"Tff7b72] Tb4b4b4.T56d364glass-card Tb4b4b4{

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-surfaceTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72border-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-border-cardTb4b4b4) Tff7b72!importantTb4b4b4;

@apply shadow-xl px-4 py-4Tb4b4b4;

Te6edf3backdrop-filterTb4b4b4: Tff7b72none Tff7b72!importantTb4b4b4;

Tff7b72-webkit-Te6edf3backdrop-filterTb4b4b4: Tff7b72none Tff7b72!importantTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364input-field Tb4b4b4{

@apply bg-sem-surface-muted border border-sem-border text-sm rounded-2xl Te6edf3focusTb4b4b4:Te6edf3ring-2 Te6edf3focusTff7b72:Te6edf3ring-sem-focus Te6edf3focusTff7b72:Tff7b72borderTff7b72-Te6edf3sem-focus-border Tff7b72block Te6edf3w-full Te6edf3p-2T79c0ff.5 Tff7b72textTff7b72-Te6edf3sem-fg Tff7b72transitionTb4b4b4;

Tb4b4b4}

Tff7b72selectTb4b4b4.T56d364input-field Tff7b72option Tb4b4b4{

@apply bg-sem-surface text-sem-fgTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364primary-chip Tb4b4b4{

@apply inline-flex! items-center! justify-center! gap-x-2! rounded-full! bg-sem-action-primary! px-4! py-2! text-xs! font-bold! text-white! shadow-xs! transition-all!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364primary-chipTb4b4b4:Tf0883ehover Tb4b4b4{

@apply bg-sem-action-primary-hover! -translate-y-0.5!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364primary-chipTb4b4b4:Tf0883eactive Tb4b4b4{

@apply scale-95! translate-y-0!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364secondary-chip Tb4b4b4{

@apply inline-flex! items-center! justify-center! gap-x-2! rounded-full! px-4! py-2! text-xs! font-bold! shadow-xs! transition-all! duration-200!Tb4b4b4;

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-secondary-chip-bgTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-secondary-chip-textTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72borderTb4b4b4: T79c0ff1Tffa657px Tff7b72solid Td2a8ffvarTb4b4b4(Te6edf3--mc-secondary-chip-borderTb4b4b4) Tff7b72!importantTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364secondary-chipTb4b4b4:Tf0883ehover Tb4b4b4{

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-secondary-chip-hover-bgTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-secondary-chip-hover-textTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72border-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-secondary-chip-hover-borderTb4b4b4) Tff7b72!importantTb4b4b4;

@apply -translate-y-0.5! shadow-md!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364secondary-chipTb4b4b4:Tf0883eactive Tb4b4b4{

@apply scale-95! translate-y-0! shadow-xs!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364dark Tb4b4b4.T56d364secondary-chipTb4b4b4:Tf0883ehover Tb4b4b4{

@apply shadow-lg! Te6edf3darkTb4b4b4:Te6edf3shadow-blue-500Tff7b72/T79c0ff10Tff7b72!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364danger-chip Tb4b4b4{

@apply inline-flex! items-center! justify-center! gap-x-2! rounded-full! px-4! py-2! text-xs! font-bold! transition-all! duration-200!Tb4b4b4;

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-danger-chip-bgTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-danger-chip-textTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72borderTb4b4b4: T79c0ff1Tffa657px Tff7b72solid Td2a8ffvarTb4b4b4(Te6edf3--mc-danger-chip-borderTb4b4b4) Tff7b72!importantTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364danger-chipTb4b4b4:Tf0883ehover Tb4b4b4{

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-danger-chip-hover-bgTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-danger-chip-hover-textTb4b4b4) Tff7b72!importantTb4b4b4;

@apply -translate-y-0.5! shadow-md!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364danger-chipTb4b4b4:Tf0883eactive Tb4b4b4{

@apply scale-95! translate-y-0!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364dark Tb4b4b4.T56d364danger-chipTb4b4b4:Tf0883ehover Tb4b4b4{

@apply shadow-lg! Te6edf3darkTb4b4b4:Te6edf3shadow-red-500Tff7b72/T79c0ff10Tff7b72!Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364glass-label Tb4b4b4{

@apply mb-1 text-sm font-semibold text-sem-fg-secondary Te6edf3darkTb4b4b4:Tff7b72textTff7b72-Te6edf3sem-fg-labelTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364monospace-field Tb4b4b4{

@apply font-mono tracking-tight text-sem-fg Te6edf3darkTb4b4b4:Tff7b72textTff7b72-Tff7b72whiteTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364metric-row Tb4b4b4{

@apply grid gap-3 Te6edf3smTb4b4b4:Tff7b72gridTff7b72-Te6edf3cols-2 Tff7b72textTff7b72-Te6edf3sem-fg-secondary Te6edf3darkTff7b72:Tff7b72textTff7b72-Te6edf3sem-fgTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364metric-value Tb4b4b4{

@apply text-lg font-semibold text-sem-fg Te6edf3darkTb4b4b4:Tff7b72textTff7b72-Tff7b72whiteTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364address-card Tb4b4b4{

@apply relative border border-sem-border-card rounded-2xl bg-sem-surface-raised p-4 space-y-2Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364address-card__label Tb4b4b4{

@apply text-xs uppercase tracking-wide text-sem-fg-mutedTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364address-card__value Tb4b4b4{

@apply text-sm text-sem-fg Te6edf3darkTb4b4b4:Tff7b72textTff7b72-Tff7b72white Tff7b72wrapTff7b72-Tff7b72break-word Te6edf3pr-16Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364address-card__action Tb4b4b4{

@apply absolute! top-3! right-3! inline-flex! items-center! gap-1! rounded-full! px-3! py-1! text-[10px]! font-bold! shadow-xs! transition-all!Tb4b4b4;

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-address-action-bgTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-address-action-textTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72borderTb4b4b4: T79c0ff1Tffa657px Tff7b72solid Td2a8ffvarTb4b4b4(Te6edf3--mc-address-action-borderTb4b4b4) Tff7b72!importantTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364address-card__actionTb4b4b4:Tf0883ehover Tb4b4b4{

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-address-action-hover-bgTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-address-action-hover-textTb4b4b4) Tff7b72!importantTb4b4b4;

Tff7b72border-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-address-action-hover-borderTb4b4b4) Tff7b72!importantTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364file-input Tb4b4b4{

@apply block w-full text-xs cursor-pointer rounded-lg border bg-sem-file-input-bg text-sem-file-input-text Te6edf3focusTb4b4b4:Tff7b72outlineTff7b72-Tff7b72hidden Te6edf3focusTff7b72:Te6edf3ring-2 Te6edf3focusTff7b72:Te6edf3ring-sem-focusTb4b4b4;

Tff7b72border-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-file-input-borderTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364file-inputTb4b4b4::Tf0883efile-selector-button Tb4b4b4{

@apply mr-2 border-0 rounded-md bg-sem-action-primary text-white px-3 py-1 text-xs font-semibold cursor-pointer Te6edf3hoverTb4b4b4:Te6edf3bg-sem-action-primary-hover Tff7b72transitionTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364dark Tb4b4b4.T56d364file-inputTb4b4b4::Tf0883efile-selector-button Tb4b4b4{

@apply bg-sem-action-primary Te6edf3hoverTb4b4b4:Te6edf3bg-sem-action-primary-hover Tff7b72textTff7b72-Tff7b72whiteTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364no-scrollbarTb4b4b4::Tf0883e-webkit-scrollbar Tb4b4b4{

Tff7b72displayTb4b4b4: Tff7b72noneTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364no-scrollbar Tb4b4b4{

Tff7b72-ms-Te6edf3overflow-styleTb4b4b4: Tff7b72noneTb4b4b4;

Tff7b72scrollbar-widthTb4b4b4: Tff7b72noneTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364custom-scrollbarTb4b4b4::Tf0883e-webkit-scrollbar Tb4b4b4{

Tff7b72widthTb4b4b4: T79c0ff6Tffa657pxTb4b4b4;

Tff7b72heightTb4b4b4: T79c0ff6Tffa657pxTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364custom-scrollbarTb4b4b4::Tf0883e-webkit-scrollbar-track Tb4b4b4{

Tff7b72backgroundTb4b4b4: Tff7b72transparentTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364custom-scrollbarTb4b4b4::Tf0883e-webkit-scrollbar-thumb Tb4b4b4{

Tff7b72backgroundTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-custom-scroll-thumbTb4b4b4)Tb4b4b4;

Tff7b72border-radiusTb4b4b4: T79c0ff10Tffa657pxTb4b4b4;

Tff7b72borderTb4b4b4: Tff7b72noneTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364custom-scrollbarTb4b4b4::Tf0883e-webkit-scrollbar-thumbTb4b4b4:Tf0883ehover Tb4b4b4{

Tff7b72backgroundTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-custom-scroll-thumb-hoverTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tb4b4b4@Tff7b72keyframes Tff7b72spin-reverse Tb4b4b4{

Tff7b72from Tb4b4b4{

Tff7b72transformTb4b4b4: Tffa657rotateTb4b4b4(T79c0ff360Tffa657degTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tff7b72to Tb4b4b4{

Tff7b72transformTb4b4b4: Tffa657rotateTb4b4b4(T79c0ff0Tffa657degTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tb4b4b4}

Tb4b4b4.T56d364animate-spin-reverse Tb4b4b4{

Tff7b72animationTb4b4b4: Te6edf3spin-reverse T79c0ff1Tffa657s Tff7b72linear Tff7b72infiniteTb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364context-menu-panel Tb4b4b4{

@apply fixed min-w-48 rounded-xl border shadow-xl bg-sem-surfaceTb4b4b4;

Tff7b72border-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-borderTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364context-item Tb4b4b4{

@apply w-full text-left px-3 py-2 text-sm flex items-center gap-2Tb4b4b4;

Tff7b72colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-context-item-textTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364context-itemTb4b4b4:Tf0883ehover Tb4b4b4{

Tff7b72background-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-context-hoverTb4b4b4)Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364context-menu-divider Tb4b4b4{

Tff7b72border-colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-context-dividerTb4b4b4)Tb4b4b4;

@apply border-t my-1Tb4b4b4;

Tb4b4b4}

Tb4b4b4.T56d364context-menu-section-label Tb4b4b4{

@apply px-3 py-1.5 text-[10px] font-black uppercase tracking-widestTb4b4b4;

Tff7b72colorTb4b4b4: Td2a8ffvarTb4b4b4(Te6edf3--mc-context-sectionTb4b4b4)Tb4b4b4;

Tb4b4b4}